Test Setup Failed
Pull Request — master (#1653)
by Aristeides
05:27
created

kirkiSetSettingValue.set   D

Complexity

Conditions 33
Paths 24

Size

Total Lines 135

Duplication

Lines 0
Ratio 0 %

Importance

Changes 0
Metric Value
cc 33
nc 24
nop 2
dl 0
loc 135
rs 4.3465
c 0
b 0
f 0

2 Functions

Rating   Name   Duplication   Size   Complexity  
A 0 3 1
A 0 5 2

How to fix   Long Method    Complexity   

Long Method

Small methods make your code easier to understand, in particular if combined with a good name. Besides, if your method is small, finding a good name is usually much easier.

For example, if you find yourself adding comments to a method's body, this is usually a good sign to extract the commented part to a new method, and use the comment as a starting point when coming up with a good name for this new method.

Commonly applied refactorings include:

Complexity

Complex classes like kirkiSetSettingValue.set often do a lot of different things. To break such a class down, we need to identify a cohesive component within that class. A common approach to find such a component is to look for fields/methods that share the same prefixes, or suffixes.

Once you have determined the fields that belong together, you can apply the Extract Class refactoring. If the component makes sense as a sub-class, Extract Subclass is also a candidate, and is often faster.

1
/* jshint -W079 */
2
/* jshint unused:false */
3
if ( _.isUndefined( window.kirkiSetSettingValue ) ) {
4
	var kirkiSetSettingValue = { // jscs:ignore requireVarDeclFirst
0 ignored issues
show
Coding Style introduced by
As per coding-style, prefer block-scoped variables using let or const which have better semantics than var.

Since ECMAScript 6, you can create block-scoped vars or constants with the keywords let or const. These variables/constants are only valid in the code block where they have been declared.

Consider the following two pieces of code:

if (true)
 {
    var x = "Hello, Stonehenge!";
}

console.log(x); //prints Hello, Stonehenge! to the console

and

if (true)
 {
    let x = "Hello, Stonehenge!";
}

console.log(x); //ReferenceError: x is not defined

The variable is not defined otuside of its block. This limits bleeding of variables into other contexts.

To know more about this ECMA6 feature, look at the MDN pages on let and const.

Loading history...
5
6
		/**
7
		 * Set the value of the control.
8
		 *
9
		 * @since 3.0.0
10
		 * @param string setting The setting-ID.
0 ignored issues
show
Documentation introduced by
The parameter string does not exist. Did you maybe forget to remove this comment?
Loading history...
11
		 * @param mixed  value   The value.
0 ignored issues
show
Documentation introduced by
The parameter mixed does not exist. Did you maybe forget to remove this comment?
Loading history...
12
		 */
13
		set: function( setting, value ) {
14
15
			/**
16
			 * Get the control of the sub-setting.
17
			 * This will be used to get properties we need from that control,
18
			 * and determine if we need to do any further work based on those.
19
			 */
20
			var $this = this,
0 ignored issues
show
Coding Style introduced by
As per coding-style, prefer block-scoped variables using let or const which have better semantics than var.

Since ECMAScript 6, you can create block-scoped vars or constants with the keywords let or const. These variables/constants are only valid in the code block where they have been declared.

Consider the following two pieces of code:

if (true)
 {
    var x = "Hello, Stonehenge!";
}

console.log(x); //prints Hello, Stonehenge! to the console

and

if (true)
 {
    let x = "Hello, Stonehenge!";
}

console.log(x); //ReferenceError: x is not defined

The variable is not defined otuside of its block. This limits bleeding of variables into other contexts.

To know more about this ECMA6 feature, look at the MDN pages on let and const.

Loading history...
21
			    subControl = wp.customize.settings.controls[ setting ],
22
			    valueJSON;
23
24
			// If the control doesn't exist then return.
25
			if ( _.isUndefined( subControl ) ) {
26
				return true;
27
			}
28
29
			// First set the value in the wp object. The control type doesn't matter here.
30
			$this.setValue( setting, value );
31
32
			// Process visually changing the value based on the control type.
33
			switch ( subControl.type ) {
34
35
				case 'kirki-background':
36
					if ( ! _.isUndefined( value['background-color'] ) ) {
37
						$this.setColorPicker( $this.findElement( setting, '.kirki-color-control' ), value['background-color'] );
38
					}
39
					$this.findElement( setting, '.placeholder, .thumbnail' ).removeClass().addClass( 'placeholder' ).html( 'No file selected' );
40
					_.each( ['background-repeat', 'background-position'], function( subVal ) {
41
						if ( ! _.isUndefined( value[ subVal ] ) ) {
42
							$this.setSelectWoo( $this.findElement( setting, '.' + subVal + ' select' ), value[ subVal ] );
43
						}
44
					});
45
					_.each( ['background-size', 'background-attachment'], function( subVal ) {
46
						jQuery( $this.findElement( setting, '.' + subVal + ' input[value="' + value + '"]' ) ).prop( 'checked', true );
47
					});
48
					valueJSON = JSON.stringify( value ).replace( /'/g, '&#39' );
49
					jQuery( $this.findElement( setting, '.background-hidden-value' ).attr( 'value', valueJSON ) ).trigger( 'change' );
50
					break;
0 ignored issues
show
Best Practice introduced by
There is no return statement in this branch, but you do return something in other branches. Did you maybe miss it? If you do not want to return anything, consider adding return undefined; explicitly.
Loading history...
51
52
				case 'kirki-code':
53
					jQuery( $this.findElement( setting, '.CodeMirror' ) )[0].CodeMirror.setValue( value );
54
					break;
0 ignored issues
show
Best Practice introduced by
There is no return statement in this branch, but you do return something in other branches. Did you maybe miss it? If you do not want to return anything, consider adding return undefined; explicitly.
Loading history...
55
56
				case 'checkbox':
57
				case 'kirki-switch':
58
				case 'kirki-toggle':
59
					value = ( 1 === value || '1' === value || true === value ) ? true : false;
0 ignored issues
show
Comprehensibility Best Practice introduced by
This re-assigns to the parameter value. Re-assigning to parameters often makes code less readable, consider introducing a new variable instead.
Loading history...
60
					jQuery( $this.findElement( setting, 'input' ) ).prop( 'checked', value );
61
					wp.customize.instance( setting ).set( value );
62
					break;
0 ignored issues
show
Best Practice introduced by
There is no return statement in this branch, but you do return something in other branches. Did you maybe miss it? If you do not want to return anything, consider adding return undefined; explicitly.
Loading history...
63
64
				case 'kirki-select':
65
				case 'kirki-preset':
66
				case 'kirki-fontawesome':
67
					$this.setSelectWoo( $this.findElement( setting, 'select' ), value );
68
					break;
0 ignored issues
show
Best Practice introduced by
There is no return statement in this branch, but you do return something in other branches. Did you maybe miss it? If you do not want to return anything, consider adding return undefined; explicitly.
Loading history...
69
70
				case 'kirki-slider':
71
					jQuery( $this.findElement( setting, 'input' ) ).prop( 'value', value );
72
					jQuery( $this.findElement( setting, '.kirki_range_value .value' ) ).html( value );
73
					break;
0 ignored issues
show
Best Practice introduced by
There is no return statement in this branch, but you do return something in other branches. Did you maybe miss it? If you do not want to return anything, consider adding return undefined; explicitly.
Loading history...
74
75
				case 'kirki-generic':
76
					if ( _.isUndefined( subControl.choices ) || _.isUndefined( subControl.choices.element ) ) {
77
						subControl.choices.element = 'input';
78
					}
79
					jQuery( $this.findElement( setting, subControl.choices.element ) ).prop( 'value', value );
80
					break;
0 ignored issues
show
Best Practice introduced by
There is no return statement in this branch, but you do return something in other branches. Did you maybe miss it? If you do not want to return anything, consider adding return undefined; explicitly.
Loading history...
81
82
				case 'kirki-color':
83
					$this.setColorPicker( $this.findElement( setting, '.kirki-color-control' ), value );
84
					break;
0 ignored issues
show
Best Practice introduced by
There is no return statement in this branch, but you do return something in other branches. Did you maybe miss it? If you do not want to return anything, consider adding return undefined; explicitly.
Loading history...
85
86
				case 'kirki-multicheck':
87
					$this.findElement( setting, 'input' ).each( function() {
88
						jQuery( this ).prop( 'checked', false );
89
					});
90
					_.each( value, function( subValue, i ) {
91
						jQuery( $this.findElement( setting, 'input[value="' + value[ i ] + '"]' ) ).prop( 'checked', true );
92
					});
93
					break;
0 ignored issues
show
Best Practice introduced by
There is no return statement in this branch, but you do return something in other branches. Did you maybe miss it? If you do not want to return anything, consider adding return undefined; explicitly.
Loading history...
94
95
				case 'kirki-multicolor':
96
					_.each( value, function( subVal, index ) {
97
						$this.setColorPicker( $this.findElement( setting, '.multicolor-index-' + index ), subVal );
98
					});
99
					break;
0 ignored issues
show
Best Practice introduced by
There is no return statement in this branch, but you do return something in other branches. Did you maybe miss it? If you do not want to return anything, consider adding return undefined; explicitly.
Loading history...
100
101
				case 'kirki-radio-buttonset':
102
				case 'kirki-radio-image':
103
				case 'kirki-radio':
104
				case 'kirki-dashicons':
105
				case 'kirki-color-palette':
106
				case 'kirki-palette':
107
					jQuery( $this.findElement( setting, 'input[value="' + value + '"]' ) ).prop( 'checked', true );
108
					break;
0 ignored issues
show
Best Practice introduced by
There is no return statement in this branch, but you do return something in other branches. Did you maybe miss it? If you do not want to return anything, consider adding return undefined; explicitly.
Loading history...
109
110
				case 'kirki-typography':
111
					_.each( ['font-family', 'variant', 'subsets'], function( subVal ) {
112
						if ( ! _.isUndefined( value[ subVal ] ) ) {
113
							$this.setSelectWoo( $this.findElement( setting, '.' + subVal + ' select' ), value[ subVal ] );
114
						}
115
					});
116
					_.each( ['font-size', 'line-height', 'letter-spacing', 'word-spacing'], function( subVal ) {
117
						if ( ! _.isUndefined( value[ subVal ] ) ) {
118
							jQuery( $this.findElement( setting, '.' + subVal + ' input' ) ).prop( 'value', value[ subVal ] );
119
						}
120
					});
121
122
					if ( ! _.isUndefined( value.color ) ) {
123
						$this.setColorPicker( $this.findElement( setting, '.kirki-color-control' ), value.color );
124
					}
125
					valueJSON = JSON.stringify( value ).replace( /'/g, '&#39' );
126
					jQuery( $this.findElement( setting, '.typography-hidden-value' ).attr( 'value', valueJSON ) ).trigger( 'change' );
127
					break;
0 ignored issues
show
Best Practice introduced by
There is no return statement in this branch, but you do return something in other branches. Did you maybe miss it? If you do not want to return anything, consider adding return undefined; explicitly.
Loading history...
128
129
				case 'kirki-dimensions':
130
					_.each( value, function( subValue, id ) {
131
						jQuery( $this.findElement( setting, '.' + id + ' input' ) ).prop( 'value', subValue );
132
					});
133
					break;
0 ignored issues
show
Best Practice introduced by
There is no return statement in this branch, but you do return something in other branches. Did you maybe miss it? If you do not want to return anything, consider adding return undefined; explicitly.
Loading history...
134
135
				case 'kirki-repeater':
136
137
					// Not yet implemented.
138
					break;
0 ignored issues
show
Best Practice introduced by
There is no return statement in this branch, but you do return something in other branches. Did you maybe miss it? If you do not want to return anything, consider adding return undefined; explicitly.
Loading history...
139
140
				case 'kirki-custom':
141
142
					// Do nothing.
143
					break;
0 ignored issues
show
Best Practice introduced by
There is no return statement in this branch, but you do return something in other branches. Did you maybe miss it? If you do not want to return anything, consider adding return undefined; explicitly.
Loading history...
144
				default:
145
					jQuery( $this.findElement( setting, 'input' ) ).prop( 'value', value );
0 ignored issues
show
Best Practice introduced by
There is no return statement in this branch, but you do return something in other branches. Did you maybe miss it? If you do not want to return anything, consider adding return undefined; explicitly.
Loading history...
146
			}
147
		},
148
149
		/**
150
		 * Set the value for colorpickers.
151
		 * CAUTION: This only sets the value visually, it does not change it in th wp object.
152
		 *
153
		 * @since 3.0.0
154
		 * @param object selector jQuery object for this element.
0 ignored issues
show
Documentation introduced by
The parameter object does not exist. Did you maybe forget to remove this comment?
Loading history...
155
		 * @param string value    The value we want to set.
0 ignored issues
show
Documentation introduced by
The parameter string does not exist. Did you maybe forget to remove this comment?
Loading history...
156
		 */
157
		setColorPicker: function( selector, value ) {
158
			selector.attr( 'data-default-color', value ).data( 'default-color', value ).wpColorPicker( 'color', value );
159
		},
160
161
		/**
162
		 * Sets the value in a selectWoo element.
163
		 * CAUTION: This only sets the value visually, it does not change it in th wp object.
164
		 *
165
		 * @since 3.0.0
166
		 * @param string selector The CSS identifier for this selectWoo.
0 ignored issues
show
Documentation introduced by
The parameter string does not exist. Did you maybe forget to remove this comment?
Loading history...
167
		 * @param string value    The value we want to set.
0 ignored issues
show
Documentation introduced by
The parameter string has already been documented on line 166. The second definition is ignored.
Loading history...
168
		 */
169
		setSelectWoo: function( selector, value ) {
170
			jQuery( selector ).selectWoo().val( value ).trigger( 'change' );
171
		},
172
173
		/**
174
		 * Sets the value in textarea elements.
175
		 * CAUTION: This only sets the value visually, it does not change it in th wp object.
176
		 *
177
		 * @since 3.0.0
178
		 * @param string selector The CSS identifier for this textarea.
0 ignored issues
show
Documentation introduced by
The parameter string does not exist. Did you maybe forget to remove this comment?
Loading history...
179
		 * @param string value    The value we want to set.
0 ignored issues
show
Documentation introduced by
The parameter string has already been documented on line 178. The second definition is ignored.
Loading history...
180
		 */
181
		setTextarea: function( selector, value ) {
182
			jQuery( selector ).prop( 'value', value );
183
		},
184
185
		/**
186
		 * Finds an element inside this control.
187
		 *
188
		 * @since 3.0.0
189
		 * @param string setting The setting ID.
0 ignored issues
show
Documentation introduced by
The parameter string does not exist. Did you maybe forget to remove this comment?
Loading history...
190
		 * @param string element The CSS identifier.
0 ignored issues
show
Documentation introduced by
The parameter string has already been documented on line 189. The second definition is ignored.
Loading history...
191
		 */
192
		findElement: function( setting, element ) {
193
			return wp.customize.control( setting ).container.find( element );
194
		},
195
196
		/**
197
		 * Updates the value in the wp.customize object.
198
		 *
199
		 * @since 3.0.0
200
		 * @param string setting The setting-ID.
0 ignored issues
show
Documentation introduced by
The parameter string does not exist. Did you maybe forget to remove this comment?
Loading history...
201
		 * @param mixed  value   The value.
0 ignored issues
show
Documentation introduced by
The parameter mixed does not exist. Did you maybe forget to remove this comment?
Loading history...
202
		 */
203
		setValue: function( setting, value, timeout ) {
204
			timeout = ( _.isUndefined( timeout ) ) ? 100 : parseInt( timeout, 10 );
0 ignored issues
show
Comprehensibility Best Practice introduced by
This re-assigns to the parameter timeout. Re-assigning to parameters often makes code less readable, consider introducing a new variable instead.
Loading history...
205
			wp.customize.instance( setting ).set({});
206
			setTimeout( function() {
207
				wp.customize.instance( setting ).set( value );
208
			}, timeout );
209
		}
210
	};
211
}
212